<template>
  <div>Vue-Router@4</div>
  <h1>counter {{ counter }}</h1>
  <h1>counter.count {{ count }}</h1>
  <h1>getter {{ double }}</h1>
  <h6>user{{ user }}</h6>
  <button @click="counter.add">点击增加</button>
  <button @click="counter.asyncadd">点击异步调用action增加</button>
  <ul>
    <li>
      <router-link to="/home">首页</router-link>
    </li>
    <li>
      <router-link to="/login">登录</router-link>
    </li>
  </ul>
  <h1>
    <router-view></router-view>
  </h1>
</template>

<script setup lang="ts">
import { RouterLink, RouterView } from 'vue-router';
import { storeToRefs } from 'pinia';
import useStore from './store';
const { counter, user } = useStore();
// const { double, count } = counter;
const { double, count } = storeToRefs(counter);
</script>

<style scoped></style>
